// 通用样式常量
export const BUTTON_STYLES = {
  primary: 'bg-ink text-paper px-6 py-3 rounded-sm hover:bg-ink-light transition-colors duration-300',
  secondary: 'border border-ink text-ink px-6 py-3 rounded-sm hover:bg-ink hover:text-paper transition-colors duration-300',
  ghost: 'text-ink-light hover:text-ink transition-colors duration-300',
} as const;

export const CARD_STYLES = {
  base: 'group overflow-hidden',
  aspectRatio: 'aspect-[4/5]',
  categoryTag: 'text-xs bg-paper-dark text-ink-light px-2 py-0.5 rounded-sm',
} as const;

export const LAYOUT_STYLES = {
  container: 'container mx-auto px-4',
  section: 'py-20',
  sectionHeader: 'text-center mb-16',
  sectionTitle: 'text-3xl font-bold mb-4 text-ink',
  sectionDivider: 'w-20 h-1 bg-wood mx-auto',
} as const;

export const ANIMATION_STYLES = {
  fadeTransition: 'transition-opacity duration-1000 ease-in-out',
  slideTransition: 'transition-transform duration-300 ease-in-out',
  colorTransition: 'transition-colors duration-300',
  allTransition: 'transition-all duration-300',
} as const;